<template>
  <div>
    <Breadcrumb :style="{ margin: '15px 0', float: 'left' }">
      <BreadcrumbItem>首页</BreadcrumbItem>
      <BreadcrumbItem>信息发布</BreadcrumbItem>
      <BreadcrumbItem>协议管理</BreadcrumbItem>
    </Breadcrumb>
    <ButtonGroup :style="{ margin: '15px 0', float: 'right' }">
      <Button @click="CreateView" type="primary">新建</Button>
      <Button @click="Delete">删除</Button>
    </ButtonGroup>
    <Content class="layer-content">
      <Form class="search" inline>
        <FormItem>
          <Input style="width: 500px" v-model="keywords" search enter-button placeholder="请输入关键字" @on-search="searchGet" @submit.native.prevent/>
        </FormItem>
        <FormItem>
          <Select placeholder="发布状态" clearable @on-change="statusSelector">
            <Option :value="0" :key="0">未发布</Option>
            <Option :value="1" :key="1">已发布</Option>
          </Select>
        </FormItem>
        <FormItem>
          <Button @click="reset">重置</Button>
        </FormItem>
      </Form>
      <Table stripe :columns="columnData" :data="dataGrid" @on-selection-change="Selector"></Table>
      <br />
      <HigPager v-model="query" :total="pageTotal" :init="Init"></HigPager>
      
      <Modal title="编辑协议" :footer-hide="true" v-model="showUpdate" fullscreen>
        <Update :callbank="EditSubmit" ref="refNewUpdate"></Update>
      </Modal>
      <Modal title="发布协议" :footer-hide="true" v-model="showCreate" fullscreen>
        <Create :callbank="CreateSubmit" :key="createKey" ref="refNewsCreate"></Create>
      </Modal>
    </Content>
  </div>
</template>
<script>
import Update from "./update.vue";
import Create from "./create.vue"
export default {
  data() {
    return {
      showUpdate: false,
      showCreate: false,
      createKey: 0,
      keywords: null,
      dataGrid: [],
      checkedArray: [],
      pageTotal: 0,
      query: {
        equal: {
          channelType: 2
        },
        pageIndex: 1,
        pageSize: 10
      },
      columnData: [
        {
          title: "序号",
          key: "newsId",
          fixed: "left",
          width: 70,
          type: "selection",
        },
        {
          title: "协议标题",
          key: "headLines"
        },
        {
          title: "协议ID",
          key: "newsId",
          width: 210
        },
        {
          title: "分类",
          key: "channelName",
          width: 150
        },
        {
          title: "发布状态",
          key: "releaseStatusText",
          width: 120
        },
        {
          title: "创建时间",
          key: "postTime",
          sortable: true,
          width: 120
        },
        {
          title: "操作",
          key: "action",
          width: 120,
          render: (h, params) => {
            return h("Dropdown",{props: {transfer:true,trigger:'click'}},
              [
                h("a",[h("a","下拉菜单"),h("Icon",{props: {type: "ios-arrow-down"}})]),
                h("DropdownMenu",{slot: "list"},
                  [
                    h("DropdownItem",{nativeOn:{click:()=>{this.EditView(params.row.newsId)}}},"编辑")
                  ]
                ),
              ]
            )
          }
        }
      ]
    };
  },
  components: {
    Update: Update,
    Create: Create
  },
  computed: {
    
  },
  methods: {
    //重置
    reset() {
      delete this.query.sqlLike
      delete this.query.equal.channelId
      this.keywords = null
      this.Init()
    },
    //搜索
    searchGet() {
      let sqlLike = {
        fields: ['channel_name','head_lines','article_title','article_content','news_keywords','content_summary'],
        keyword: this.keywords
      }
      this.query.sqlLike = sqlLike
      this.Init()
    },
    Selector(selection) {
      this.checkedArray = [];
      selection.forEach((element) => {
        this.checkedArray.push(element.newsId);
      });
    },
    channelSelector(id) {
      if(!this.query.equal) this.query.equal = {}
      this.query.equal.channelId = id
      this.Init()
    },
    statusSelector(status) {
      if(!this.query.equal) this.query.equal = {}
      this.query.equal.releaseStatus = status
      this.Init()
    },
    //初始化商品
    Init() {
      new this.$rest({
        service: "agrobiz-msg",
        gateway: 'agrobiz',
        url: "/v1.0/news/content/page",
        query: this.query,
        action: (res) => {
          if (res.data.code === 20000) {
            const data = res.data.data
            data.list.forEach(element => {
              element.releaseStatusText = element.releaseStatus === 0 ? '未发布' : '已发布'
              element.postTime = this.$date(element.postTime,'yyyy-MM-dd')
            })
            this.dataGrid = data.list
            this.pageTotal = data.count
          } else {
            this.$Notice.warning({
              title: "获取失败",
              desc: `失败原因：${res.data.msg}`,
            });
          }
        },
      }).get();
    },
    Delete() {
      new this.$rest({
        gateway: 'agrobiz',
        service: "agrobiz-msg",
        url: "/v1.0/news/content",
        data: {
          pojo: this.checkedArray,
        },
        action: (res) => {
          if (res.data.code === 20000) {
            this.Init();
          } else {
            this.$Notice.error({
              title: "删除失败",
              desc: `失败原因：${res.data.msg}`,
            });
          }
        },
      }).delete();
    },
    EditView(newsId) {
      this.showUpdate = true
      this.$refs.refNewUpdate.Init(newsId)
    },
    EditSubmit() {
      this.showUpdate = false
      this.Init()
    },
    CreateView() {
      this.showCreate = true
      this.$refs.refNewsCreate.Init()
    },
    CreateSubmit() {
      this.showCreate = false
      this.createKey ++
      this.Init()
    }
  },
  created() {
    this.Init()
  },
};
</script>